﻿@using SettlersAuto.Web.Models
@model TradeOverviewModel

@{
    ViewBag.Title = "Best prices";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Best prices</h2>
Currency: <b>@Model.CurrentCurrency</b> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
Select currency: 
@foreach (var currency in Model.Currencies){
    <span>@Html.ActionLink(currency, MVC.Trade.Index(currency))</span>
}
<br />

Timestamp: 
@Model.LatestTradeSession.Timestamp 
<span id="new-data-available" class="hidden" >New data is available. @Html.ActionLink("Click here to update.", MVC.Trade.Index())</span>

<div id="best-prices">
@foreach (var category in Model.BestOffersCategories){   
    <h3>@category.CategoryName</h3> 
    foreach (var product in category.Products){
        <div class="product">
            @Product.RenderPrice(product.BestPrice)
            @Product.PriceDifference(product.AveragePrice, product.BestPrice, 20, false)
            <span class="name">@Html.ActionLink(product.ProductDisplayName, MVC.Trade.ProductDetails(product.ProductName, Model.CurrentCurrency))</span>
        </div>
    }
}
</div>

@section scripts{

    <script type="text/javascript">

        var isDataAvailable = false;

        function EnsureDataAvailable() {
            if (!isDataAvailable) {
                $.getJSON(
                    '@Url.Action(MVC.Trade.IsNewSessionAvailable(Model.LatestTradeSession.TradeSessionId))',
                    null,
                    function (result){ 
                        if (result.dataAvailable) {
                            isDataAvailable = true;
                            $("#new-data-available").removeClass("hidden");
                        }

                        setTimeout(EnsureDataAvailable, 3000);
                    }
                );
            }
        }

        $(document).ready(function(){
            setTimeout(EnsureDataAvailable, 3000);
        });
    </script>
}